<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<style>
    /*重新设置样式*/
    .form-control {
        width: 196px !important;
        height: 34px !important;
        padding: 10px !important;
    }

    #recommendtable {
        box-sizing: border-box !important;
        width: 100% !important;
        margin-bottom: 1rem !important;
        color: #212529 !important;
        border-collapse: collapse !important;
        display: table !important;
        border-spacing: 2px !important;
        border-color: grey !important;
        text-align: left !important;
    }

    #recommendtable th {
        height: 50px;
    }

    #recommendtable tr {
        height: 35px;
        display: table-row;
        vertical-align: inherit;
        border-color: inherit;
        border-top-color: inherit;
        border-right-color: inherit;
        border-left-color: inherit;
        border-bottom: 2px #F3F1F1 solid;
    }

    #recommendtable td {
        font-size: 16px;
    }

    #recommendtable tr:nth-child(odd) {
        background: #FFFFFF !important;
    }

    #recommendtable tr:nth-child(even) {
        background: #FFFFFF !important;
    }

    .showinfo, .hideinfo {
        cursor: pointer;
        text-align: center;
    }
</style>
<body class="hold-transition skin-blue sidebar-mini">
<section class="content-header">
    <h1>
        台账信息查询
    </h1>
</section>
<!--查看台账模态框-->
<div class="modal fade" id="modal-view">
    <div class="modal-dialog" style="width: 750px; height: 600px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">台账信息</h4>
            </div>
            <div class="modal-body">
                <table id="bootstrap-table-view"></table>
                <div id="annex" class="row">
                    <div class="col-lg-12"
                         style="
                                border-bottom: 1px solid #cdcdcd;
                                color: #444;
                                padding: 0px">
                             <span
                                     style="
                                        text-transform: uppercase;
                                        font-weight: 600;
                                        line-height: 50px;
                                        border-bottom: 4px solid #1e88e5;
                                        display: inline-block;
                                        margin: 0 0 -1px;
                                        font: 400 16px/36px 'Open Sans Condensed',sans-serif;
                                        padding: 0 5px 0 0;
                                        outline: none;">附件列表
                             </span></div>
                    <table id="recommendtable">
                        <thead>
                        <tr>
                            <th>文件名</th>
                            <th style="width: 15%;text-align: center">文件大小</th>
                            <th style="width: 10%;text-align: center">下载次数</th>
                            <th style="width: 10%;text-align: center">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td>
                                <small><p style="word-wrap: break-word;width: 100%"></p></small>
                            </td>
                            <td>
                                <small></small>
                            </td>
                            <td>
                                <small></small>
                            </td>
                            <td>
                                <small></small>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" data-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <form id="queryForm">
                        <div class="row">
                            <div class="form-inline">
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>
                                        物料描述
                                    </label>
                                    <input type="text" id="ityMatDesc" name="ityMatDesc"
                                           class="form-control"
                                           placeholder="请输入物料描述">
                                </div>
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>
                                        仓库
                                    </label>
                                    <select id="ityWhiId"
                                            style="padding: 0px!important;text-align: center!important;text-align-last: center!important;width: auto!important;"
                                            name="ityWhiId" class="form-control">
                                    </select>
                                </div>
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>字段名</label>
                                    <input type="text" id="imiField" name="imiField"
                                           class="form-control"
                                           placeholder="请输入字段名">
                                </div>
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>值</label>
                                    <input type="text" id="imiValue" name="imiValue"
                                           class="form-control"
                                           placeholder="请输入值">
                                </div>
                                <div class="form-group" style="margin-right: 10px;">
                                    <button type="button" class="btn btn-success" id="btn-search">搜索</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="box-body" style="padding-top: 0px;">
                    <table id="bootstrap-table"></table>
                </div>

            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>

<script th:inline="javascript">

    /**加载表格*/
    var table, table2;

    /**
     *@Description: 获取仓库列表
     */
    function findWarehouseList() {
        js.ajax({
            url: ctx + 'common/warehouseInfo/list',
            type: 'post',
            traditional: true,            // 阻止深度序列化， 使参数可以使用数组
            dataType: 'json',
            contentType: "application/x-www-form-urlencoded",
            data: {},
            async: true,                // 异步执行
            success: function (result) {
                if (result.type === web_status.SUCCESS) {
                    $('#ityWhiId').empty();
                    if (hasP("purinv:purinvedit:view")) {
                        $('#ityWhiId').append('<option selected="selected" style="vertical-align: middle;text-align: center" value="">全部</option>');
                    }
                    // if (hasP("purinv:purinvedit:view") ) {
                    //     $('#ityWhiId').append('<option selected="selected" style="vertical-align: middle;text-align: center" value="-100">全部</option>');
                    // }
                    // if (hasP("purinv:purinvedit:view") ) {
                    //     $('#ityWhiId').append('<option selected="selected" style="vertical-align: middle;text-align: center" value="-90">全部</option>');
                    // }
                    // if (!hasP("purinv:purinvedit:view")) {
                    //     $('#ityWhiId').append('<option selected="selected" style="vertical-align: middle;text-align: center" value="-80">全部</option>');
                    // }
                    // if (hasP("purinv:purinvedit:view")) {
                    //     $('#ityWhiId').append('<option selected="selected" style="vertical-align: middle;text-align: center" value="-70">全部</option>');
                    // }

                    for (var i = 0; i < result.data.rows.length; i++) {
                        $('#ityWhiId').append('<option style="vertical-align: middle;text-align: center" value="' + result.data.rows[i].whiId + '">' + result.data.rows[i].whiName + '</option>');
                    }
                } else {
                    js.modal.warning(result.msg);
                }
            },
            error: function () {
                js.modal.fail();
            }
        })
    }

    /**查看*/
    function viewLedger(ityId) {
        js.modal.open("modal-view");
        loadInfoTable(ityId);
    }

    /**
     *@Description: 加载明细主表
     */
    function loadInfoTable(ityId) {
        /** 加载附件列表 */
        getAnnexList($("#anxItyId").val());
        $("bootstrap-table-view").bootstrapTable('destroy');
        table2 = js.table.init({
            id: 'bootstrap-table-view',
            url: ctx + "pInventoryInfoEdit/findPInventoryMaterielInfoList",
            showColumns: false,
            showExport: false,
            pageSize: 15,
            queryParams: function (params) {
                var curParams = {
                    // 传递参数查询参数
                    pageSize: params.limit,
                    pageNum: params.offset / params.limit + 1,
                    sort: params.sort,
                    order: params.order,
                    imiItyId: ityId
                };
                return curParams;
            },
            columns: [
                {
                    title: '序号', field: 'imiId', width: '40',
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                },
                {title: '字段名', field: 'imiField'},
                {title: '值', field: 'imiValue'},
                {title: '台账单位', field: 'imiUnit'},
                {title: '物料描述', field: 'ityMatDesc'},
                {title: '数量', field: 'ityNum'},
                {title: '单位', field: 'ityNumUnit'},
            ]
        });
    }

    /**
     *@FunctionName: getAnnexList
     *@Description: 加载文件列表
     *@DesignIdea: 根据外购件库存表主键加载文件列表
     *@Author: 徐一贺
     *@CreateDate: 2020/5/28 12:41
     *@Phone: 18241927380
     *@Param: [ity] 外购件主键
     *@Version: v1.0.0
     */
    function getAnnexList(ityId) {
        js.post({
            url: ctx + "pInventoryInfoEdit/getAnnexList",
            data: {
                anxItyId: ityId
            },
            success: function (result) {
                $("#recommendtable tbody").html('');
                var tbodyHtml = '';
                var tableData = result.data;
                if (tableData.length > 0) {
                    $("#annex").show();
                } else {
                    $("#annex").hide();
                }
                for (var i = 0; i < tableData.length; i++) {
                    var download = '';
                    var remove = '';
                    if (hasP('purinv:purledgerview:download')) {
                        download = '<a onclick="delayLoading(' + tableData[i].anxItyId + ')" href="/pInventoryInfoEdit/download/' + tableData[i].anxId + '" class="btn btn-primary btn-xs"> 下载</a>';
                    }
                    tbodyHtml += ' <tr><td style="vertical-align: middle"><small><p style="line-height: 35px;padding-top:8px;word-wrap: break-word;width: 100%;">' + tableData[i].anxFileName + '</p></small></td>' +
                        '<td style="text-align: center"><small>' + tableData[i].anxFileSize + tableData[i].anxFileSizeUnit + '</small></td>' +
                        '<td style="text-align: center"><small>' + tableData[i].anxDownloadCount + '</small></td>' +
                        '<td style="text-align: center">' + download + remove +
                        '</td></tr>';
                }
                $("#recommendtable tbody").html(tbodyHtml);
            }
        })
    }

    /**
     *@Description: 加载主表
     */
    function loadMainTable() {
        $("#bootstrap-table").bootstrapTable('destroy');
        /** 加载列表 */
        table = js.table.init({
            id: 'bootstrap-table',
            url: ctx + "pInventoryInfoEdit/findPInventoryMaterielInfoList",
            pageSize: 300,
            columns: [
                {
                    title: '序号', field: 'ityId', width: '40',
                    formatter: function (value, row, index, field) {
                        return index + 1;
                    }
                },
                {title: '字段名', field: 'imiField'},
                {title: '值', field: 'imiValue'},
                {title: '台账单位', field: 'imiUnit'},
                {title: 'SAP物料编码', field: 'itySapCode', width: '90'},
                {title: '物料描述', field: 'ityMatDesc'},
                {title: '数量', field: 'ityNum'},
                {title: '单位', field: 'ityNumUnit'},
                {title: '仓库', field: 'ityWhiName'},
                {title: '区位', field: 'ityPosition'},
                {
                    title: '操作',
                    formatter: function (value, row, index) {
                        var actions = [];
                        if (hasP("purinv:purledgerview:view")) {
                            actions.push('<a class="btn btn-info btn-xs" href="javascript:void(0)" onclick="viewLedger(' + row.imiItyId + ')"> 查看</a>');
                        }
                        return actions.join('');
                    }
                }
            ]
        });
    }


    $(function () {
        $("title").html($("title").html()+" —— 台账信息");
        /** 加载仓库列表 */
        findWarehouseList();
        /** 表格搜索 */
        $("#btn-search").click(function () {
            loadMainTable();
        });
    })

</script>

</body>
</html>